<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="./js/sethtmlfontSize.js"></script>
    <link rel="shortcut icon" href="./images/logo.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="./css/common.css">
    <style>
        /*头部*/
.header{ width:16rem; background:#fff; margin:0 auto; padding-top:.5rem; padding-bottom:.5rem; } .header-left,.header-center,.header-right{ float:left; height:1.25rem; line-height:1.25rem; text-align:center; } .header-center{ font-size:.7rem; } .header-right{ font-size:.6rem; width:3.4rem; background: #fff; } .header-left{ position:relative; width:2.2rem; background:#fff; } .header-left i{ width: .5rem; height: .5rem; border-bottom:1px solid #333; border-left:1px solid #333; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); display: inline-block; position: absolute; top:0.2rem; } .header-center{ width:10.37rem; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -webkit-appearance:none; appearance:none; position:relative; text-align:center; }
.header-right a{ color:#36c7b7; } .header-right a:link{ color:#36c7b7; } .header-right a:visited { color:#36c7b7; } .header-right a:hover{ color:#36c7b7; } .header-right a:active{ color:#333; } .header-right #login{ display:block; }
        .allmap{
            margin:0 auto;
            width:16rem;
            height:18rem;
            margin-top: 2rem;
        }
        #address{
            position: absolute;
    width: 16rem;
    top: 2rem;
    left: 50%;
    margin-left: -8rem;
    background: #fff;
    color: #000;
    font-size: .65rem;
    padding-top: .2rem;
    border-top: 1px solid #f0f0f0;
        }
    
    </style>
    <title>商家位置</title>
    
</head>
<body>
    <!--头部-->
    <header class="header">
        <div class="header-left">
            <i></i>
        </div>
        <div class="header-center">
            <span id="shopName">服务详情</span>
        </div>
        <div class="header-right">
        </div>
        <div class="clears"></div>
    </header>
    <div class="allmap" id="allmap">
        
    </div>
    <div class="address" id="address">
        
    </div>   
</body>
<script src="./js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=A2DaAspWaAq1kmdyfgD2TBmWuxxfyOMn"></script>
<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script> 
<script>
    $(".header-left i").on("click",function(){
        history.back(-1);
    });
    function getQueryString(name){  
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");  
        var r = window.location.search.substr(1).match(reg);  
        if (r != null){
            return decodeURIComponent(r[2]);
        }else{
            return null;
        }      
    }
    
    (function(){
        var locX=getQueryString("locX");
        var locY=getQueryString("locY");
        var address=getQueryString("address");
        document.getElementById("address").innerHTML="店铺地址:&nbsp;&nbsp;&nbsp;&nbsp;"+address;
        console.log("============="+locX+"---"+locY+"---"+address);
        var map=new BMap.Map("allmap");
        map.centerAndZoom(new BMap.Point(locX,locY),15);
        map.addControl(new BMap.NavigationControl());        // 添加平移缩放控件
        map.addControl(new BMap.ScaleControl());             // 添加比例尺控件
        map.addControl(new BMap.OverviewMapControl());       //添加缩略地图控件
        map.enableScrollWheelZoom(true);
        var geolocation = new BMap.Geolocation();
        //设置标注的图标
        var icon = new BMap.Icon("./images/loc3.png",new BMap.Size(60,60));
        var marker1 = new BMap.Marker(new BMap.Point(locX,locY),{icon:icon});        
        map.addOverlay(marker1);
    
    })();
</script>
</html>